


    <?php 

$cs = Yii::app ()->getClientScript (); 
// $cs = Yii::app ()->getClientScript()->registerCoreScript ('jquery'); 
$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/jquery-1.7.1.min.js");
$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/menu/jquery.fixedMenu.js");
$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/Base.js");
$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/menu/jquery.opacityrollover.js");
$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/menu/jquery.galleriffic.js");
$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/menu/jquery.history.js");

    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/Three.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Clock.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Color.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Edge.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Face3.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Face4.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Geometry.js");

    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Math.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Vector2.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Vector3.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Vector4.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Matrix3.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Matrix4.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Object3D.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Projector.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Quaternion.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Ray.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Rectangle.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Spline.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/UV.js");
        $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Frustum.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Vertex.js");

    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/cameras/Camera.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/cameras/OrthographicCamera.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/cameras/PerspectiveCamera.js");
    
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/lights/Light.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/lights/AmbientLight.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/lights/DirectionalLight.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/lights/PointLight.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/lights/SpotLight.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/Material.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/LineBasicMaterial.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/MeshBasicMaterial.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/MeshLambertMaterial.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/MeshPhongMaterial.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/MeshDepthMaterial.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/MeshNormalMaterial.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/MeshPhongMaterial.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/MeshFaceMaterial.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/MeshShaderMaterial.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/ParticleBasicMaterial.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/ParticleCanvasMaterial.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/ParticleDOMMaterial.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/ShaderMaterial.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/textures/Texture.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/textures/DataTexture.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/Particle.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/ParticleSystem.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/Line.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/Mesh.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/Bone.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/SkinnedMesh.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/Ribbon.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/LOD.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/Sprite.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/MorphAnimMesh.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/scenes/Scene.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/scenes/Fog.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/scenes/FogExp2.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/DOMRenderer.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/CanvasRenderer.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/SVGRenderer.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/WebGLShaders.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/WebGLRenderer.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/WebGLRenderTarget.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/WebGLRenderTargetCube.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/renderables/RenderableVertex.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/renderables/RenderableFace3.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/renderables/RenderableFace4.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/renderables/RenderableObject.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/renderables/RenderableParticle.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/renderables/RenderableLine.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/ColorUtils.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/GeometryUtils.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/ImageUtils.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/SceneUtils.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/ShaderUtils.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/animation/AnimationHandler.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/animation/Animation.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/animation/AnimationMorphTarget.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/cameras/FirstPersonCamera.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/cameras/CombinedCamera.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/cameras/CubeCamera.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/cameras/PathCamera.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/cameras/FlyCamera.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/cameras/RollCamera.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/cameras/TrackballCamera.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/controls/FirstPersonControls.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/controls/FlyControls.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/controls/PathControls.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/controls/RollControls.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/controls/TrackballControls.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/core/Curve.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/core/CurvePath.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/core/Path.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/core/Shape.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/core/TextPath.js"); 
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/core/BufferGeometry.js"); 
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/CubeGeometry.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/CylinderGeometry.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/ExtrudeGeometry.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/IcosahedronGeometry.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/LatheGeometry.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/OctahedronGeometry.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/PlaneGeometry.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/SphereGeometry.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/TextGeometry.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/TorusGeometry.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/TorusKnotGeometry.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/loaders/Loader.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/loaders/JSONLoader.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/loaders/BinaryLoader.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/loaders/ColladaLoader.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/loaders/SceneLoader.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/loaders/UTF8Loader.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/modifiers/SubdivisionModifier.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/objects/MarchingCubes.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/plugins/LensFlarePlugin.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/plugins/ShadowMapPlugin.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/plugins/SpritePlugin.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/renderers/AnaglyphWebGLRenderer.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/renderers/CrosseyedWebGLRenderer.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/renderers/ParallaxBarrierWebGLRenderer.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/shaders/ShaderFlares.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/shaders/ShaderSprite.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/RequestAnimationFrame.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/fonts/helvetiker_regular.typeface.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/Stats.js");
    
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/menu/jquery.fixedMenu.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/menu/dock.js");
      $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/Detector.js");
      $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/Stats.js");
      $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/DAT.GUI.min.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/room/HouseNew.js");
    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/room/FacilityNew.js");
    
    
    $cs->registerScript('saveHouseUrl', "saveHouseUrl='".$this->createUrl('/webgl/saveHouse')."';",CClientScript::POS_BEGIN);
    $cs->registerScript('loadHouseUrl', "loadHouseUrl='".$this->createUrl('/webgl/loadHouse')."';",CClientScript::POS_BEGIN);

?>


  
  
<div class='buttons'>

</div>

     <script type="text/javascript">

  jQuery(document).ready(function($) {
      //if ( ! Detector.webgl ) Detector.addGetWebGLMessage();

      var stats;
      var camera, scene, renderer;
      var projector, plane, cube;
      var mouse2D, mouse3D, ray,
      rollOveredFace, isShiftDown = false,
      theta = 45, isCtrlDown = false;

      var rollOverMesh, rollOverMaterial;
      var cubeGeo, cubeMaterial;
      var i, intersector;
      var info;
      var stageWidth,stageHeight;
      var objects=[];
      var centerOffset;
      var rollOverMesh;
    var stageSize;
    var house;
    var gid;
    var cameraTarget;
    var gui, voxelConfig = {
        orthographicProjection: false
      };
var voxelPosition = new THREE.Vector3(), tmpVec = new THREE.Vector3();
      init();
      animate();
    
      function init() {
        //$('#dock').attr('float','left');
        //$('#dock').attr('top','30px');
        //$('#dock').attr('zIndex',100);
        //$('.stage').append($('#dock'));
        
        

        stageWidth=window.innerWidth;
        stageHeight=window.innerHeight;
        stageSize={width:stageWidth,height:stageHeight};
        
        // cameraTarget = new THREE.Vector3( 0, 0, 0 );
        // // camera = new THREE.Camera( stageSize.width, stageSize.height, 20, 1, 10000, -2000, 10000 );
        // var aspect = stageWidth / stageHeight;
        // camera = new THREE.Camera( 75, aspect, 1, 100000 );
        // camera.position.y = 800;
        
        var aspect = stageWidth / stageHeight;
        camera = new THREE.Camera( 100, aspect, 1, 100000 );
        camera.position.z = 600;
        camera.position.x = 0;
        camera.position.y = 200;

        camera.updateMatrix();
        
        scene = new THREE.Scene();

        // // roll-over helpers
// 
       // cursorGeo = new THREE.CubeGeometry( 50, 20, 50 );
       // cursorMaterial = new THREE.MeshBasicMaterial( { color: 0x123456, opacity: 0.5, transparent: true } );
       // cursorMesh = new THREE.Mesh( cursorGeo, cursorMaterial );
       // scene.add( cursorMesh );


        // cubes
        
        //cube2Geo = new THREE.CubeGeometry( 300, 300, 300 );
        //cube2Material = new THREE.MeshLambertMaterial( { color: 0x00ff80, ambient: 0x00ff80, shading: THREE.FlatShading, map: THREE.ImageUtils.loadTexture( "textures/square-outline-textured.png" ) } );
        //cube2Material.color.setHSV( 0.1, 0.7, 1.0 );
        //cube2Material.ambient = cube2Material.color;
        //cube2Mesh = new THREE.Mesh( cube2Geo, cube2Material );
        //cube2Mesh.position.set(300,150,300); 
        //scene.add(cube2Mesh);
        
        
        // picking

        projector = new THREE.Projector();

        // // grid
// 
        // // plane = new THREE.Mesh( new THREE.PlaneGeometry( 1000, 1000, 20, 20 ), new THREE.MeshBasicMaterial( { color: 0x999933, wireframe: true } ) );
        // // plane.rotation.x = - 90 * Math.PI / 180;
        // // plane.name="background";
        // // scene.addObject( plane );
        // planeGeo=new THREE.PlaneGeometry( 2000, 2000, 50, 50 );
        // planeGeo.computeBoundingBox();
    // plane = new THREE.Mesh( new THREE.PlaneGeometry( 2000, 2000, 50, 50 ), new THREE.MeshBasicMaterial( { color: 0x555555, wireframe: true } ) );
    // //plane = new THREE.Mesh( new THREE.Planintersector.object.size 2000, 2000 , 200, 200));
    // // plane.rotation.x = - 90 * Math.PI / 180;
    // plane.name="background";
    // plane.size=planeGeo.boundingBox.max.subSelf(planeGeo.boundingBox.min);
    // scene.add( plane );
    
        planeGeo = new THREE.CubeGeometry( 2000, 2,2000 );
        planeMat=new THREE.MeshBasicMaterial( { color: 0x112233 } ) ;
        plane=addMesh( planeGeo, 1, 0, -1, 0, 0, 0, 0, planeMat,"background" );
        
        // for(var i=0; i<plane.faceUvs.length; i++) {
          // var uvs = plane.faceUvs[i];
          // for ( j = 0, jl = uvs.length; j < jl; j++ ) {
            // uvs[j].u *= 10;
            // uvs[j].v *= 10;
          // }

        // }
        
    

        mouse2D = new THREE.Vector3( 0, 10000, 0.5 );
        centerOffset=new THREE.Vector3( 0, 0, 0);
        

    // Lights

        var ambientLight = new THREE.AmbientLight( 0x606060 );
        scene.add( ambientLight );

        var directionalLight = new THREE.DirectionalLight( 0xffffff );
        directionalLight.position.set( 1, 0.75, 0.5 ).normalize();
        scene.add( directionalLight );

        renderer = new THREE.WebGLRenderer( { antialias: true, preserveDrawingBuffer : true } );
        renderer.setSize( window.innerWidth, window.innerHeight );

            $('.stage').append( $(renderer.domElement) );



        
        stats = new Stats();
        stats.domElement.style.position = 'absolute';
        stats.domElement.style.top = '30px';
        $('.stage').append( $(stats.domElement) );
        

        // add GUI
        gui = new DAT.GUI();
        gui.add(voxelConfig, 'orthographicProjection').onChange(function(){

          if ( voxelConfig.orthographicProjection ) {
            camera.toOrthographic();
            camera.position.x = 1000;
                    camera.position.y = 707.106;
                    camera.position.z = 1000;
            theta = 90;
          } else {
            camera.toPerspective();
            camera.position.y = 800;
          }

        });
        gui.close();
        
        $('.stage canvas').bind('mousemove',function(event){move(event);}); 
        $(this).bind('keydown',function(event){
              switch( event.keyCode ) {

          case 16: isShiftDown = !isShiftDown; break;
          case 17: isCtrlDown = !isCtrlDown; break;

        }
    });

      }

      function addMesh( geometry, scale, x, y, z, rx, ry, rz, material,name ) {

        geometry.computeBoundingBox();
        mesh = new THREE.Mesh( geometry, material );
        mesh.scale.x = mesh.scale.y = mesh.scale.z = scale;
        mesh.position.x = x;
        mesh.position.y = y;
        mesh.position.z = z;
        mesh.rotation.x = rx;
        mesh.rotation.y = ry;
        mesh.rotation.z = rz;
        mesh.overdraw = true;
        mesh.doubleSided = false;
        mesh.name=name;
        mesh.size=geometry.boundingBox.max.subSelf(geometry.boundingBox.min);
        mesh.updateMatrix();


        scene.add(mesh);
        
        return mesh;
      
      }
      
      //

      function animate() {

        requestAnimationFrame( animate );

        render();
        stats.update();

      }

      function render() {

        if(house){
          if(house.facilityMoveFlg)
              house.setFacilityCoordinate(plane,scene,camera);
        }


        if ( isShiftDown ) {

          theta += mouse2D.x * 3;

        }
        
        if(isCtrlDown){
          theta += mouse2D.x * 3;
          camera.position.y = 1400 * Math.cos( theta * Math.PI / 360 );
        }
        camera.position.x = 1400 * Math.sin( theta * Math.PI / 360 );
        camera.position.z = 1400 * Math.cos( theta * Math.PI / 360 );

        camera.lookAt( plane );
        renderer.render( scene, camera );

      }


      function getRealIntersector( intersects ) {

        for( i = 0; i < intersects.length; i++ ) {

          intersector = intersects[ i ];

          if ( intersector.object != plane&&intersector.object != facility.cursorMesh ) {

            return intersector;

          }

        }

        return null;

      }
      
    function setVoxelPosition( intersector ) {

        tmpVec.copy( intersector.face.normal );

        voxelPosition.add( intersector.point, intersector.object.matrixRotationWorld.multiplyVector3( tmpVec ) );

        voxelPosition.x = Math.floor( voxelPosition.x / 50 ) * 50 + 25;
        voxelPosition.y = Math.floor( voxelPosition.y / 50 ) * 50 + 25;
        voxelPosition.z = Math.floor( voxelPosition.z / 50 ) * 50 + 25;
        // console.log(voxelPosition.x+","+voxelPosition.y+","+voxelPosition.z+";");
      }
    buildHouse=function(hsId,roomStyles){
      
      house=new House(camera,scene);
      // house.build(hsId,roomStyles);
    house.loadHouseStyle(hsId,roomStyles);
      
    }
  loadHouse=function(h){

    // for(i in objects){
      // scene.removeObject(objects[i]);
    // }
    // scene.add( plane );
    while(scene.getChildByName('fac')||scene.getChildByName('wall')||scene.getChildByName('floor')){
        scene.remove(scene.getChildByName('fac'));
        scene.remove(scene.getChildByName('wall'));
        scene.remove(scene.getChildByName('floor'));
    }
    
    house=new House(camera,scene);
    house.load(h);
    $('.stage canvas').bind('click',{stageSize:stageSize,objects:objects},locate);
    // alert(h);
    
  };
    
  quoteMesh=function(goodsGeo,event){   
      event.preventDefault();
      house.addFacility(goodsGeo,scene);
      // facility.createMesh(goodsGeo,scene);

      $('.stage canvas').unbind('click');
      showButtons(event);
      // $('.stage canvas').bind('mousemove',{stageSize:stageSize,plane:plane},move); 
      // $('.stage canvas').bind('click',{stageSize:stageSize,objects:objects},locate);
        }
      
      var move=function(event){
        event.preventDefault();
        mouse2D.x = ( event.clientX / stageSize.width ) * 2 - 1;
        mouse2D.y = - ( event.clientY / stageSize.height ) * 2 + 1;
        if(house)
        house.moveFacility(mouse2D,plane,scene,camera);
        // facility.move(event);
      };
      
      var getFocus=function(event){
        mouse2D.x = ( event.clientX / stageSize.width ) * 2 - 1;
        mouse2D.y = - ( event.clientY / stageSize.height ) * 2 + 1;
        house.getFacility(mouse2D,plane);
        $('.stage canvas').unbind('click');
        // $('.stage canvas').bind('click',locate);
        showButtons(event);
      };
  var showButtons= function (event) {

  $('.stage canvas').unbind('mousemove');
  $( '.buttons' ).load("index.php?r=webgl/buttons",{x:event.clientX,y:event.clientY},function(){
      $("#move").click(function(){
          $('.stage canvas').bind('mousemove',{stageSize:stageSize,plane:plane},move);
          $('.stage canvas').bind('click',{stageSize:stageSize,objects:objects},locate);
      });
      $("#rotate").click(function(){
          $('.stage canvas').bind('mousemove',{curmouse:{x:event.clientX,y:event.clientY}},rotate);
          $('.stage canvas').bind('click',{stageSize:stageSize,objects:objects},locate);
      });
      
       $(".tool").click(function(){
        $( ".block" ).animate({
            width:"0px"
          }, {
          duration: 300
        });
        $( ".tool" ).animate({
          width:"0px"
        },{duration: 300
        });
      });
  });
  

  };
    var locate=function(event){
        // facility.isCollided(event);
        if(house){
        $('.stage canvas').unbind('mousemove');
        $('.stage canvas').unbind('click');
        house.releaseFacility();
        //$('.stage canvas').bind('mousemove',function(event){move(event);}); 
        $('.stage canvas').bind('click',function(event){getFocus(event,plane);}); 
    }
      };

  var rotate=function(event){
    
      facility.rotate(event);
  };
      


  var saveHouse=function(saveHouseUrl){
    house?house.save(saveHouseUrl):alert("please load house style first");
    
  };


      $('#save').click(function(){
        // alert(saveHouseUrl);
        saveHouse(saveHouseUrl);
      });
      
      // $('#load').click(function(){
        // // alert(saveHouseUrl);
        // loadHouse(loadHouseUrl);
      // });
      
        });


    </script>
  
<div class='stage'>

</div>
<?php include  dirname(__FILE__).'/toolbar.php';?>  
<div class='house'></div>
